<template>
  <div>
    <el-container>
      <el-header class="header">
        <h2>日历 :</h2>
      </el-header>

      <el-main>
        <div>
          <el-calendar v-model="value">
          </el-calendar>
        </div>
      </el-main>
    </el-container>
  </div>
</template>

<script>
  export default {
    data() {
      return {
         value: new Date()
      }
    },
  }
</script>

<style lang="less" scoped>
  .header {
    tab-size: 20px;
    color: #F56C6C;
    margin: 20px 0 20px 20px;
  }
</style>